
@extends('home.home')


@section('content')

@section('slide')
        @include('home.slide')
@endsection
        <!--侧边导航 -->
<div id="nav" class="navfull">
    <div class="area clearfix">
        <div class="category-content" id="guide_2">

            <div class="category">
                <ul class="category-list" id="js_climit_li">
                    @foreach($tops as $top)

                            <li class="appliance js_toggle relative ">
                                <div class="category-info">
                                    <h3 class="category-name b-category-name"><i><img src="/homes/images/cake.png"></i><a class="ml-22" title="">{{$top->name}}</a></h3>
                                    <em>&gt;</em></div>
                                <div class="menu-item menu-in top">
                                    <div class="area-in">
                                        <div class="area-bg">
                                            <div class="menu-srot">
                                                <div class="sort-side">

                                                    <dl class="dl-sort">
                                                        <dt><span title="">{{$top->name}}</span></dt>
                                                        @foreach($cats as $cat)
                                                        @if ($cat->pid  ===$top->id)
                                                            <dd><a title="蒸蛋糕" href="/cat/{{$cat->id}}"><span>{{$cat->name}}</span></a></dd>
                                                        @endif
                                                        @endforeach
                                                    </dl>

                                                </div>
                                                <div class="brand-side">
                                                    <dl class="dl-sort"><dt><span>实力商家</span></dt>
                                                        <dd><a rel="nofollow" title="呵官方旗舰店" target="_blank" href="#" rel="nofollow"><span  class="red" >呵官方旗舰店</span></a></dd>
                                                        <dd><a rel="nofollow" title="格瑞旗舰店" target="_blank" href="#" rel="nofollow"><span >格瑞旗舰店</span></a></dd>
                                                        <dd><a rel="nofollow" title="飞彦大厂直供" target="_blank" href="#" rel="nofollow"><span  class="red" >飞彦大厂直供</span></a></dd>
                                                        <dd><a rel="nofollow" title="红e·艾菲妮" target="_blank" href="#" rel="nofollow"><span >红e·艾菲妮</span></a></dd>
                                                        <dd><a rel="nofollow" title="本真旗舰店" target="_blank" href="#" rel="nofollow"><span  class="red" >本真旗舰店</span></a></dd>
                                                        <dd><a rel="nofollow" title="杭派女装批发网" target="_blank" href="#" rel="nofollow"><span  class="red" >杭派女装批发网</span></a></dd>
                                                    </dl>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <b class="arrow"></b>
                            </li>




                    @endforeach
                </ul>
            </div>
        </div>

    </div>
</div>


<!--轮播-->

<script type="text/javascript">
    (function() {
        $('.am-slider').flexslider();
    });
    $(document).ready(function() {
        $("li").hover(function() {
            $(".category-content .category-list li.first .menu-in").css("display", "none");
            $(".category-content .category-list li.first").removeClass("hover");
            $(this).addClass("hover");
            $(this).children("div.menu-in").css("display", "block")
        }, function() {
            $(this).removeClass("hover")
            $(this).children("div.menu-in").css("display", "none")
        });
    })
</script>



<!--小导航 -->
<div class="am-g am-g-fixed smallnav">
    <div class="am-u-sm-3">
        <a href="sort.html"><img src="/homes/images/navsmall.jpg" />
            <div class="title">商品分类</div>
        </a>
    </div>
    <div class="am-u-sm-3">
        <a href="#"><img src="/homes/images/huismall.jpg" />
            <div class="title">大聚惠</div>
        </a>
    </div>
    <div class="am-u-sm-3">
        <a href="#"><img src="/homes/images/mansmall.jpg" />
            <div class="title">个人中心</div>
        </a>
    </div>
    <div class="am-u-sm-3">
        <a href="#"><img src="/homes/images/moneysmall.jpg" />
            <div class="title">投资理财</div>
        </a>
    </div>
</div>

<!--走马灯 -->

<div class="marqueen">
    <span class="marqueen-title">商城头条</span>
    <div class="demo">

        <ul>
            <li class="title-first"><a target="_blank" href="#">
                    <img src="/homes/images/TJ2.jpg"></img>
                    <span>[特惠]</span>商城爆品1分秒
                </a></li>
            <li class="title-first"><a target="_blank" href="#">
                    <span>[公告]</span>商城与广州市签署战略合作协议
                    <img src="/homes/images/TJ.jpg"></img>
                    <p>XXXXXXXXXXXXXXXXXX</p>
                </a></li>

            <div class="mod-vip">
                <div class="m-baseinfo">
                    <a href="../person/index.html">
                        <img src="/homes/images/getAvatar.do.jpg">
                    </a>
                    <em>
                        Hi,<span class="s-name">小叮当</span>
                        <a href="#"><p>点击更多优惠活动</p></a>
                    </em>
                </div>
                <div class="member-logout">
                    <a class="am-btn-warning btn" href="login.html">登录</a>
                    <a class="am-btn-warning btn" href="register.html">注册</a>
                </div>
                <div class="member-login">
                    <a href="#"><strong>0</strong>待收货</a>
                    <a href="#"><strong>0</strong>待发货</a>
                    <a href="#"><strong>0</strong>待付款</a>
                    <a href="#"><strong>0</strong>待评价</a>
                </div>
                <div class="clear"></div>
            </div>

            <li><a target="_blank" href="#"><span>[特惠]</span>洋河年末大促，低至两件五折</a></li>
            <li><a target="_blank" href="#"><span>[公告]</span>华北、华中部分地区配送延迟</a></li>
            <li><a target="_blank" href="#"><span>[特惠]</span>家电狂欢千亿礼券 买1送1！</a></li>

        </ul>
        <div class="advTip"><img src="/homes/images/advTip.jpg"/></div>
    </div>
</div>
<div class="clear"></div>
</div>
<script type="text/javascript">
    if ($(window).width() < 640) {
        function autoScroll(obj) {
            $(obj).find("ul").animate({
                marginTop: "-39px"
            }, 500, function() {
                $(this).css({
                    marginTop: "0px"
                }).find("li:first").appendTo(this);
            })
        }
        $(function() {
            setInterval('autoScroll(".demo")', 3000);
        })
    }
</script>
</div>
<div class="shopMainbg">
    <div class="shopMain" id="shopmain">

        <!--今日推荐 -->

        <div class="am-g am-g-fixed recommendation">
            <div class="clock am-u-sm-3 ">
            <img src="/homes/images/2016.png "></img>
            <p>今日<br>推荐</p>
        </div>
        <div class="am-u-sm-4 am-u-lg-3 ">
            <div class="info ">
                <h3>真的有鱼</h3>
                <h4>开年福利篇</h4>
            </div>
            <div class="recommendationMain one">
                <a href="introduction.html"><img src="/homes/images/tj.png "></img></a>
            </div>
        </div>
        <div class="am-u-sm-4 am-u-lg-3 ">
            <div class="info ">
                <h3>囤货过冬</h3>
                <h4>让爱早回家</h4>
            </div>
            <div class="recommendationMain two">
                <img src="/homes/images/tj1.png "></img>
            </div>
        </div>
        <div class="am-u-sm-4 am-u-lg-3 ">
            <div class="info ">
                <h3>浪漫情人节</h3>
                <h4>甜甜蜜蜜</h4>
            </div>
            <div class="recommendationMain three">
                <img src="/homes/images/tj2.png "></img>
            </div>
        </div>

    </div>
    <div class="clear "></div>




    <div id="f9">
        <!--甜点-->

        <div class="am-container ">
            <div class="shopTitle ">
                <h4>甜品</h4>
                <h3>每一道甜品都有一个故事</h3>
                <div class="today-brands ">
                    <a href="# ">桂花糕</a>
                    <a href="# ">奶皮酥</a>
                    <a href="# ">栗子糕 </a>
                    <a href="# ">马卡龙</a>
                    <a href="# ">铜锣烧</a>
                    <a href="# ">豌豆黄</a>
                </div>
							<span class="more ">
                    <a href="# ">更多美味<i class="am-icon-angle-right" style="padding-left:10px ;" ></i></a>
                        </span>
            </div>
        </div>

        <div class="am-g am-g-fixed floodFour">
            <div class="am-u-sm-5 am-u-md-4 text-one list ">
                <div class="word">
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                </div>
                <a href="# ">
                    <div class="outer-con ">
                        <div class="title ">
                            开抢啦！
                        </div>
                        <div class="sub-title ">
                            零食大礼包
                        </div>
                    </div>
                    <img src="/homes/images/act1.png " />
                </a>
                <div class="triangle-topright"></div>
            </div>

            <div class="am-u-sm-7 am-u-md-4 text-two sug">
                <div class="outer-con ">
                    <div class="title ">
                        雪之恋和风大福
                    </div>
                    <div class="sub-title ">
                        ¥13.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/2.jpg" /></a>
            </div>

            <div class="am-u-sm-7 am-u-md-4 text-two">
                <div class="outer-con ">
                    <div class="title ">
                        雪之恋和风大福
                    </div>
                    <div class="sub-title ">
                        ¥13.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/1.jpg" /></a>
            </div>


            <div class="am-u-sm-3 am-u-md-2 text-three big">
                <div class="outer-con ">
                    <div class="title ">
                        小优布丁
                    </div>
                    <div class="sub-title ">
                        ¥4.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/5.jpg" /></a>
            </div>

            <div class="am-u-sm-3 am-u-md-2 text-three sug">
                <div class="outer-con ">
                    <div class="title ">
                        小优布丁
                    </div>
                    <div class="sub-title ">
                        ¥4.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/3.jpg" /></a>
            </div>

            <div class="am-u-sm-3 am-u-md-2 text-three ">
                <div class="outer-con ">
                    <div class="title ">
                        小优布丁
                    </div>
                    <div class="sub-title ">
                        ¥4.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/4.jpg" /></a>
            </div>

            <div class="am-u-sm-3 am-u-md-2 text-three last big ">
                <div class="outer-con ">
                    <div class="title ">
                        小优布丁
                    </div>
                    <div class="sub-title ">
                        ¥4.8
                    </div>
                    <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                </div>
                <a href="# "><img src="/homes/images/5.jpg" /></a>
            </div>

        </div>
        <div class="clear "></div>
    </div>


    <div id="f10">
        <!--坚果-->
        <div class="am-container ">
            <div class="shopTitle ">
                <h4>坚果</h4>
                <h3>酥酥脆脆，回味无穷</h3>
                <div class="today-brands ">
                    <a href="# ">腰果</a>
                    <a href="# ">松子</a>
                    <a href="# ">夏威夷果 </a>
                    <a href="# ">碧根果</a>
                    <a href="# ">开心果</a>
                    <a href="# ">核桃仁</a>
                </div>
							<span class="more ">
                    <a href="# ">更多美味<i class="am-icon-angle-right" style="padding-left:10px ;" ></i></a>
                        </span>
            </div>
        </div>
        <div class="am-g am-g-fixed floodThree ">
            <div class="am-u-sm-4 text-four list">
                <div class="word">
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                    <a class="outer" href="#"><span class="inner"><b class="text">核桃</b></span></a>
                </div>
                <a href="# ">
                    <img src="/homes/images/act1.png " />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                    </div>
                </a>
                <div class="triangle-topright"></div>
            </div>
            <div class="am-u-sm-4 text-four">
                <a href="# ">
                    <img src="/homes/images/6.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>
            <div class="am-u-sm-4 text-four sug">
                <a href="# ">
                    <img src="/homes/images/7.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>

            <div class="am-u-sm-6 am-u-md-3 text-five big ">
                <a href="# ">
                    <img src="/homes/images/10.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>
            <div class="am-u-sm-6 am-u-md-3 text-five ">
                <a href="# ">
                    <img src="/homes/images/8.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>
            <div class="am-u-sm-6 am-u-md-3 text-five sug">
                <a href="# ">
                    <img src="/homes/images/9.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>
            <div class="am-u-sm-6 am-u-md-3 text-five big">
                <a href="# ">
                    <img src="/homes/images/10.jpg" />
                    <div class="outer-con ">
                        <div class="title ">
                            雪之恋和风大福
                        </div>
                        <div class="sub-title ">
                            ¥13.8
                        </div>
                        <i class="am-icon-shopping-basket am-icon-md  seprate"></i>
                    </div>
                </a>
            </div>

        </div>

        <div class="clear "></div>
    </div>
@endsection


